<div class="p-3 bg-white p-3 bg-white">
  <h1 class="h3 m-0">Tabs & accordions</h1>
</div>
<div class="p-3 relative">
  <div class="row">
    <div class="col-sm-6">

      <!-- Nav tabs -->
      <ul class="nav nav-tabs" role="tablist">
        <li class="nav-item">
          <a class="nav-link active" data-toggle="tab" data-target="#home2" role="tab"><i class="fa fa-comment"></i>
            Home</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" data-toggle="tab" data-target="#profile2" role="tab"><i class="fa fa-globe"></i>
            Profile</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" data-toggle="tab" data-target="#messages2" role="tab"><i class="fa fa-file"></i> Messages</a>
        </li>
      </ul>
      <div class="tab-content">
        <div class="tab-pane active" id="home2" role="tabpanel">
          <div class="p-3 tab-holder mb-3">
            Home Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
            dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex
            ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat
            nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit
            anim id est
          </div>
        </div>
        <div class="tab-pane" id="profile2" role="tabpanel">
          <div class="p-3 tab-holder mb-3">
            Profile Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
            et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
            ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
            fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt
            mollit anim id est
          </div>
        </div>
        <div class="tab-pane" id="messages2" role="tabpanel">
          <div class="p-3 tab-holder mb-3">
            Messages Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
            et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
            ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
            fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt
            mollit anim id est
          </div>
        </div>
      </div>

      <!-- Nav tabs -->
      <ul class="nav nav-tabs nav-justified" role="tablist">
        <li class="nav-item">
          <a class="nav-link active" data-toggle="tab" data-target="#home4" role="tab"><i
              class="fa fa-comment fa-2x"></i></a>
        </li>
        <li class="nav-item">
          <a class="nav-link" data-toggle="tab" data-target="#profile4" role="tab"><i class="fa fa-globe fa-2x"></i></a>
        </li>
        <li class="nav-item">
          <a class="nav-link" data-toggle="tab" data-target="#messages4" role="tab"><i class="fa fa-file fa-2x"></i></a>
        </li>
      </ul>
      <div class="tab-content">
        <div class="tab-pane active" id="home4" role="tabpanel">
          <div class="p-3 tab-holder mb-3">
            Home Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
            dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex
            ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat
            nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit
            anim id est
          </div>
        </div>
        <div class="tab-pane" id="profile4" role="tabpanel">
          <div class="p-3 tab-holder mb-3">
            Profile Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
            et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
            ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
            fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt
            mollit anim id est
          </div>
        </div>
        <div class="tab-pane" id="messages4" role="tabpanel">
          <div class="p-3 tab-holder mb-3">
            Messages Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
            et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
            ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
            fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt
            mollit anim id est
          </div>
        </div>
      </div>

      <!-- Nav tabs -->
      <ul class="nav nav-tabs nav-line nav-justified" role="tablist">
        <li class="nav-item">
          <a class="nav-link active" data-toggle="tab" data-target="#home10" role="tab"><i
              class='fa fa-comment-o fa-3x'></i></a>
        </li>
        <li class="nav-item">
          <a class="nav-link" data-toggle="tab" data-target="#profile10" role="tab"><i
              class='fa fa-globe fa-3x'></i></a>
        </li>
        <li class="nav-item">
          <a class="nav-link" data-toggle="tab" data-target="#messages10" role="tab"><i class='fa fa-file-o fa-3x'></i></a>
        </li>
      </ul>
      <div class="tab-content">
        <div class="tab-pane active" id="home10" role="tabpanel">
          <div class="p-3 tab-holder mb-3">
            Home Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
            dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex
            ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat
            nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit
            anim id est
          </div>
        </div>
        <div class="tab-pane" id="profile10" role="tabpanel">
          <div class="p-3 tab-holder mb-3">
            Profile Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
            et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
            ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
            fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt
            mollit anim id est
          </div>
        </div>
        <div class="tab-pane" id="messages10" role="tabpanel">
          <div class="p-3 tab-holder mb-3">
            Messages Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
            et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
            ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
            fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt
            mollit anim id est
          </div>
        </div>
      </div>

      <div id="accordion" role="tablist" aria-multiselectable="true">
        <div class="panel panel-accordion">
          <div class="card-header" role="tab" id="headingOne">
            <h5 class="panel-title">
              <a data-toggle="collapse" data-parent="#accordion" data-target="#collapseOne" aria-expanded="true"
                 aria-controls="collapseOne">
                Collapsible Group Item #1
              </a>
            </h5>
          </div>
          <div id="collapseOne" class="panel-collapse collapse " role="tabpanel" aria-labelledby="headingOne">
            Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon
            officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3
            wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et.
            Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan
            excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt
            you probably haven't heard of them accusamus labore sustainable VHS.
          </div>
        </div>
        <div class="panel panel-accordion">
          <div class="card-header" role="tab" id="headingTwo">
            <h5 class="panel-title">
              <a class="collapsed" data-toggle="collapse" data-parent="#accordion" data-target="#collapseTwo"
                 aria-expanded="false" aria-controls="collapseTwo">
                Collapsible Group Item #2
              </a>
            </h5>
          </div>
          <div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
            Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon
            officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3
            wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et.
            Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan
            excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt
            you probably haven't heard of them accusamus labore sustainable VHS.
          </div>
        </div>
        <div class="panel panel-accordion">
          <div class="card-header" role="tab" id="headingThree">
            <h5 class="panel-title">
              <a class="collapsed" data-toggle="collapse" data-parent="#accordion" data-target="#collapseThree"
                 aria-expanded="false" aria-controls="collapseThree">
                Collapsible Group Item #3
              </a>
            </h5>
          </div>
          <div id="collapseThree" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">
            Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon
            officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3
            wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et.
            Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan
            excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt
            you probably haven't heard of them accusamus labore sustainable VHS.
          </div>
        </div>
      </div>

    </div>
    <div class="col-sm-6">


      <!-- Nav tabs -->
      <ul class="nav nav-tabs nav-tabs-triangle" role="tablist">
        <li class="nav-item">
          <a class="nav-link active" data-toggle="tab" data-target="#home5" role="tab">Home</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" data-toggle="tab" data-target="#profile5" role="tab">Profile</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" data-toggle="tab" data-target="#messages5" role="tab">Messages</a>
        </li>
      </ul>
      <div class="tab-content">
        <div class="tab-pane active" id="home5" role="tabpanel">
          <div class="p-3 tab-holder mb-3">
            Home Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
            dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex
            ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat
            nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit
            anim id est
          </div>
        </div>
        <div class="tab-pane" id="profile5" role="tabpanel">
          <div class="p-3 tab-holder mb-3">
            Profile Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
            et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
            ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
            fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt
            mollit anim id est
          </div>
        </div>
        <div class="tab-pane" id="messages5" role="tabpanel">
          <div class="p-3 tab-holder mb-3">
            Messages Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
            et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
            ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
            fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt
            mollit anim id est
          </div>
        </div>
      </div>

      <!-- Nav tabs -->
      <ul class="nav nav-tabs nav-justified nav-line" role="tablist">
        <li class="nav-item">
          <a class="nav-link active" data-toggle="tab" data-target="#home6" role="tab">Home</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" data-toggle="tab" data-target="#profile6" role="tab">Profile</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" data-toggle="tab" data-target="#messages6" role="tab">Messages</a>
        </li>
      </ul>
      <div class="tab-content">
        <div class="tab-pane active" id="home6" role="tabpanel">
          <div class="p-3 tab-holder mb-3">
            Home Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
            dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex
            ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat
            nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit
            anim id est
          </div>
        </div>
        <div class="tab-pane" id="profile6" role="tabpanel">
          <div class="p-3 tab-holder mb-3">
            Profile Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
            et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
            ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
            fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt
            mollit anim id est
          </div>
        </div>
        <div class="tab-pane" id="messages6" role="tabpanel">
          <div class="p-3 tab-holder mb-3">
            Messages Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
            et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
            ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
            fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt
            mollit anim id est
          </div>
        </div>
      </div>

      <!-- Nav tabs -->
      <ul class="nav nav-tabs nav-line" role="tablist">
        <li class="nav-item">
          <a class="nav-link active" data-toggle="tab" data-target="#home8" role="tab"><i class="fa fa-globe"></i> Home</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" data-toggle="tab" data-target="#profile8" role="tab"><i class="fa fa-gear"></i>
            Profile</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" data-toggle="tab" data-target="#messages8" role="tab"><i class="fa fa-comments"></i>
            Messages</a>
        </li>
      </ul>
      <div class="tab-content">
        <div class="tab-pane active" id="home8" role="tabpanel">
          <div class="p-3 tab-holder mb-3">
            Home Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
            dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex
            ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat
            nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit
            anim id est
          </div>
        </div>
        <div class="tab-pane" id="profile8" role="tabpanel">
          <div class="p-3 tab-holder mb-3">
            Profile Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
            et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
            ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
            fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt
            mollit anim id est
          </div>
        </div>
        <div class="tab-pane" id="messages8" role="tabpanel">
          <div class="p-3 tab-holder mb-3">
            Messages Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
            et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
            ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
            fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt
            mollit anim id est
          </div>
        </div>
      </div>

      <div class="row">
        <div class="col-sm-12">
          <div class=" panel">
            <div class="card-block">
              <!-- Nav tabs -->
              <ul class="nav nav-tabs nav-line" role="tablist">
                <li class="nav-item">
                  <a class="nav-link active" data-toggle="tab" data-target="#home9" role="tab">Home</a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" data-toggle="tab" data-target="#profile9" role="tab">Profile</a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" data-toggle="tab" data-target="#messages9" role="tab">Messages</a>
                </li>
              </ul>

              <div class="tab-content">
                <div class="tab-pane active" id="home9" role="tabpanel">
                  <div class="bg-white mt-2">
                    Home Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
                    labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
                    nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit
                    esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
                    culpa qui officia deserunt mollit anim id est
                  </div>
                </div>
                <div class="tab-pane" id="profile9" role="tabpanel">
                  <div class="bg-white mt-2">
                    Profile Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
                    labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
                    nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit
                    esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
                    culpa qui officia deserunt mollit anim id est
                  </div>
                </div>
                <div class="tab-pane" id="messages9" role="tabpanel">
                  <div class="bg-white mt-2">
                    Messages Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt
                    ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
                    nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit
                    esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
                    culpa qui officia deserunt mollit anim id est
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>

      <div class="row">
        <div class="col-sm-6">
          <div class=" panel">
            <div class="card-block">
              <!-- Nav tabs -->
              <ul class="nav nav-tabs nav-line mt-0" role="tablist">
                <li class="nav-item">
                  <a class="nav-link active" data-toggle="tab" data-target="#home12" role="tab"><i
                      class='fa fa-comment-o'></i></a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" data-toggle="tab" data-target="#profile12" role="tab"><i class='fa fa-globe'></i></a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" data-toggle="tab" data-target="#messages12" role="tab"><i
                      class='fa fa-file-o'></i></a>
                </li>
              </ul>

              <div class="tab-content">
                <div class="tab-pane active" id="home12" role="tabpanel">
                  <div class="mt-2">
                    Home Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
                    labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
                    nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit
                    esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
                    culpa qui officia deserunt mollit anim id est
                  </div>
                </div>
                <div class="tab-pane" id="profile12" role="tabpanel">
                  <div class="mt-2">
                    Profile Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
                    labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
                    nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit
                    esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
                    culpa qui officia deserunt mollit anim id est
                  </div>
                </div>
                <div class="tab-pane" id="messages12" role="tabpanel">
                  <div class="mt-2">
                    Messages Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt
                    ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
                    nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit
                    esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
                    culpa qui officia deserunt mollit anim id est
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="col-sm-6">
          <div class=" panel">
            <div class="card-block">
              <!-- Nav tabs -->
              <ul class="nav nav-tabs nav-line nav-justified mt-0" role="tablist">
                <li class="nav-item">
                  <a class="nav-link active" data-toggle="tab" data-target="#home11" role="tab"><i
                      class='fa fa-comment-o fa-2x'></i></a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" data-toggle="tab" data-target="#profile11" role="tab"><i
                      class='fa fa-globe fa-2x'></i></a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" data-toggle="tab" data-target="#messages11" role="tab"><i
                      class='fa fa-file-o fa-2x'></i></a>
                </li>
              </ul>

              <div class="tab-content">
                <div class="tab-pane active" id="home11" role="tabpanel">
                  <div class="mt-2">
                    Home Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
                    labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
                    nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit
                    esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
                    culpa qui officia deserunt mollit anim id est
                  </div>
                </div>
                <div class="tab-pane" id="profile11" role="tabpanel">
                  <div class="mt-2">
                    Profile Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
                    labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
                    nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit
                    esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
                    culpa qui officia deserunt mollit anim id est
                  </div>
                </div>
                <div class="tab-pane" id="messages11" role="tabpanel">
                  <div class="mt-2">
                    Messages Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt
                    ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
                    nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit
                    esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
                    culpa qui officia deserunt mollit anim id est
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>

    </div>
  </div>
</div>
